
#chatbox .chatrow {
    border: 1px solid #ddd;
    border-radius: 4px;
    margin-bottom: 1em;
    margin-top   : 1em;
    overflow-y   : auto;
    background   : #f8f8f8;
    height : 500px;
    padding: 8px;
}

#chatbox .chat-item {
    display: table;
    width : 100%;
}
#chatbox .chat-line {
    display: table-row;
}
#chatbox .chat-body {
    display: table-cell;
    vertical-align: top;
    padding: 6px;
}
#chatbox .chat-head {
    display: table-cell;
    vertical-align: top;
    width : 30px;
}
#chatbox .chat-head-icon {
    width : 30px;
    height: 30px;
    background: url(../../../static/assets/img/head_icon.jpg) top center no-repeat;
    background-size: 100% 100%;
}
#chatbox .chat-body-name ,
#chatbox .chat-body-text {
    font-size  : 14px;
    line-height: 20px;
}
#chatbox .chat-body-name {
    background: #ddd;
    color: #888;
}
#chatbox .chat-body-text {
    background: #fff;
    color: #222;
}
#chatbox .chat-body-name:empty ,
#chatbox .chat-body-text:empty {
    display: none;
}
#chatbox .chat-mine .chat-body-name ,
#chatbox .chat-mine .chat-body-text {
    text-align: right;
}
